<!--
 * @Author: wuchao66_Git 2803670835@qq.com
 * @Date: 2023-02-18 11:22:33
 * @LastEditors: wuchao66_Git 2803670835@qq.com
 * @LastEditTime: 2023-03-06 16:37:03
 * @FilePath: \t154appxg\src\views\department\index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AEname
-->
<template>
  <div>
    <div id="main" style="width: 600px; height: 400px"></div>
  </div>
</template>

<script>
import * as echarts from "echarts";
import { findDepar } from "../../api/department";
export default {
  data() {
    return {
      option1: {},
    };
  },
  created() {
    this.getDepartMent1();
  },
  methods: {
    async getDepartMent1() {
      let res = await findDepar();
      this.option1 = {
        title: {
          text: "用户管理系统图标11151",
        },
        tooltip: {},
        xAxis: {
          data: res.data.names,
        },
        yAxis: {},
        series: [
          {
            name: "部门人数111",
            type: "bar",
            data: res.data.counts,
          },
        ],
      };
      this.showPicture();
    },
    showPicture() {
      // 基于准备好的dom，初始化echarts实例
      var myChart = echarts.init(document.getElementById("main"));
      myChart.setOption(this.option1);
    },
  },
};
</script>

<style></style>
